<template>
<div class="wrap">
	<h3>修改密码</h3>
	<div class="content">
		<input type="text" placeholder="15035675376" class="int"/>
		<input type="text" placeholder="请输入密码(6-20号码字符)" class="int"/>
		<input type="text" placeholder="请再次输入密码确认" class="int"/>
		<div class="verification">
			<input type="text" placeholder="验证码"/>
			<i></i>
			<span>看不清换一张</span>
		</div>		
		<div class="phone">
			<input type="text" placeholder="手机验证码"/>
			<button>获取验证码</button>
		</div>		
		<button class="submit">提交修改</button>
	</div>	
</div>
</template>

<script>
	export default{
		name:"changepassword"
	}
</script>

<style scoped>
.wrap{
	width: 1085px;
	height: 623px;
	border: 1px solid rgb(242,242,242);	
}
h3{
	font-weight: 200;
	font-size: 18px;
	color: rgb(84,85,85);
	text-indent: 22px;
	line-height: 58px;
	border-bottom: 1px solid rgb(242,242,242);	
}
.content{
	padding: 40px 0 0 40px;
}
.submit{
	display: inline-block;
	width: 150px;
	height: 50px;
	border: none;
	color: white;
	font-size: 18px;
	background-color: rgb(247,131,39);
	border-radius: 5px;
	margin-top: 40px;
	font-weight: 100;
	margin-left: 86px;
}
input{
	display: inline-block;
	width: 300px;
	height:38px;
	font-size: 15px;
	text-indent: 14px;
	color: rgb(191,191,191);
	background-color: rgb(249,249,249);
	border: 1px solid rgb(211,211,211);
}
.int{
	margin: 0 700px 30px 0;
}
.verification{
	margin-bottom: 30px;
}
.verification>input{
	width: 112px;
}
.verification>span{
	color: rgb(62,148,68);
}
.verification>i{
	display: inline-block;
	width: 80px;
	height: 34px;
	background: url(../../assets/image/verification.png);
	vertical-align: middle;
}
.phone{
	width:306px ;
	height:44px ;
	border: 1px solid rgb(211,211,211);
}
.phone>input{
	width: 150px;
	border: none;
}
.phone>button{
	width: 100px;
	height: 32px;
	border: none;
	background-color: rgb(61,142,67);
	margin-left: 42px;
	font-size: 14px;
	color: white;
	font-weight: 100;
}
</style>